<template>
	<view>
		<view class="headerCon">
			<u-field v-model="search.type" label="机身码" placeholder="请输入机身码"><u-button size="mini" slot="right" type="success" @click="searchClick">搜索</u-button></u-field>
		</view>
		<view class="tableCon">
			<view class="tabelPopup">
				<InStorageSearch :list="list" :need-sum="true" :col="tableCol" @sort-change="sortChange">	
				</InStorageSearch>
			</view>
			<!-- 弹窗内容 -->
			<!-- <u-empty margin-top="12"  :show="receivedListLength == 0" mode="data"></u-empty>
			<view class="flex padding-xs" v-for="(item, index) in receivedList" :key="item.id">
				<view class="listItem" style="width: 50%;" @click="openProductInfoModal(item)">{{ item.mcuid }}</view>
				<view class="listItem" style="width: 50%;" @click="openProductInfoModal(item)">{{ item.reportNumber }}</view>
			</view> -->
		</view>
		<u-back-top :scroll-top="scrollTop"></u-back-top>
		<!-- 弹窗组件 -->
		<productInfoReport :visible="productInfoModalVisible" :list="productInfoList" @close-modal="closeProductInfoModal"></productInfoReport>
		<!-- 分页组件 -->
		<!-- <view>
		<uni-pagination :current="pageIndex" :total="total" :page-size="pageSize"
		 prev-text="上一页" next-text="下一页" @change="pageChage"/>
		</view> -->
	
	</view>
</template>

<script>
import { mapActions } from 'vuex';
import 	ProductInfoReport from './components/productInfoListModal/productInfoReport.vue';
import InStorageSearch from './components/storageListSearch/inStorageSearch.vue';
export default {
	components: {
		InStorageSearch,
		ProductInfoReport
	},
	data() {
		return {
			// 分页
			pageIndex:1,
			pageSize:10,
			total:0,
			// 弹窗
			receivedList: [],
			productInfoModalVisible: false,
			productInfoList: [],
			scrollTop: 0,
			search: {
				type: ''
			},
			list: [],
			list2: [],
			originList: [],
			tableCol: [
				{
					label: '机身码',
					key: 'mcuid',
					needSort: true
				},
				// {
				// 	label: '数量',
				// 	key: 'amount',
				// 	needSort: true,
				// },
				{
					label: '型号',
					key: 'xh',
					needSort: true,
				},
				{
					label: '保修结束日期',
					key: 'endDate',
					isDate: true
				}
			]
		};
	},
	computed:{
		receivedListLength(){
			return this.receivedList.length
		}
	},
	onPageScroll(e) {
		this.scrollTop = e.scrollTop;
	},
	onReady() {
		this.initData();
	},
	methods: {
		...mapActions({
			getProductList: 'storageOrder/getProductList',
			// 查看list
			getReportPageList: 'storageOrder/getReportPageList',
			// 查看详情
			getDetailReportList: 'storageOrder/getDetailReportList',
			// 根据报备单号查信息
			getQueryOrderReport:'storageOrder/getQueryOrderReport',	
		}),
			
			// getList() {
			// 		let sendData = {
			// 			page: this.pageIndex,
			// 			limit: this.pageSize,
			// 			statistics: this.search.time,
			// 			search: this.search.search,
			// 			status: this.search.status,
			// 			data: '',
			// 			sceneId: '',
			// 			type: 0
			// 		};
			// 		let apiName = 'getReportPageList';
			// 		if (this.accountType == '1') {
			// 			sendData.acceptor = this.$store.state.user.userInfo.No;
			// 		} else if (this.accountType == '2') {
			// 			apiName = 'getReportPageList';
			// 			sendData.master = this.$store.state.user.userInfo.No;
			// 		}
			// 		this[apiName](sendData)
			// 			.then(res => {
			// 				console.log(res);
			// 				if (res.code == 0) {
			// 					this.selectedRows = [];
			// 					this.curDetail = {};
			// 					this.list = res.data.list;
			// 					this.total = res.data.totalRow;
			// 				}
			// 				let str = this.timeOption[this.search.time].label.replace(/\(.{0,}\)/g, '');
			// 				this.$set(this.timeOption, this.search.time, {
			// 					value: this.search.time,
			// 					label: `${str}(${res.data.totalRow})`
			// 				});
			// 			})
			// 			.catch(err => {
			// 				console.log(err);
			// 			});
			// 	},
		
		
		// searchChange(){
		// 	this.pageIndex=1;
		// 	this.$nextTick(()=>{
		// 		this.getList();
		// 	});
		// },
		
		scroll(e){
			this.old.scrollTop=e.detail.scrollTop;
		},
		pageChange(obj){
			console.log(obj);
			this.scrollTop=this.old.scrollTop;
			this.$nextTick(function(){
				this.scrollTop=0;
			});
			this.getList(obj.current)
		},
		initData() {
			// this.getQueryOrderReport()
			this.getReportPageList()
				.then(res => {
					console.log(res);
					// if (res && res.code == 0) {
					if (res && res.code == 0) {
						// let list=res.data.list;
						let originList = [];
						let receivedList = [];
						// list.forEach(e=>{
						res.data.list.forEach(e => {
							// if (e.rkZt == 1 && e.xsZt != 1 && e.ckZt != 1) {
								originList.push(e);
							// }
							// 判断弹窗 
							e.checked=false;
							let isInOrder=false;
							if(e.detail){
								for(let i=0;i<e.detail.length;i++){
									if(e.detail[i].endDate){
										isInOrder=true;
										break;
									}
								}
							}
							// if(isInOrder){
								receivedList.push(e);
							// }
						});
						// this.receivedList=receivedList;
						originList.sort((a, b) => {
							if (a.endDate && b.endDate) {
								return new Date(b.endDate.replace(/\-/g, '/')).getTime() - new Date(a.endDate.replace(/\-/g, '/')).getTime();
							} else if (a.endDate) {
								return -1;
							} else {
								return 1;
							}
						});
						// stringify转字符串
						this.list = JSON.parse(JSON.stringify(originList));
						console.log("124");
						console.log(this.list);
						console.log("124");
						this.originList = originList;
						this.receivedList = receivedList;
					}else{
						this.receivedList = [];
					}
				})
				.catch(err => {
					console.log(err);
				});
		},
		openProductInfoModal(e) {
			console.log(e);
			this.productInfoList = e.detail;
			this.productInfoModalVisible = true;
		},
		closeProductInfoModal() {
			this.productInfoModalVisible = false;
		},
		searchClick() {
			let originList = this.originList;
			let listCache = [];
			if (this.search.type) {
				originList.forEach(e => {
					// if (e.model && e.model.includes(this.search.type)) {
					if (e.mcuid && e.mcuid.includes(this.search.type)) {
						listCache.push(e);
					}
				});
			} else {
				listCache = originList;
			}
			this.list = JSON.parse(JSON.stringify(listCache));
		},
		sortChange(list) {
			this.list = list;
		}
	}
};
</script>

<style lang="less">
@import './styles/queryLayout.less';
// 新加
@import './styles/layout.less';
@import './styles/table.less';

</style>
